<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>用户中心 - __SITENAME__</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0" />
    <link type="text/css" href="__DOMAINURL____WEBSITEDIR____BAOFENG__/css/public.css" rel="stylesheet" />
    <link href="__DOMAINURL____WEBSITEDIR____BAOFENG__/css/font_1473832019_2999358.css" rel="stylesheet" type="text/css" />
    <link href="__DOMAINURL____WEBSITEDIR____BAOFENG__/css/fonts/iconfont.css" rel="stylesheet" type="text/css" />
    <script src="__DOMAINURL____WEBSITEDIR____PLUGINS__/jQuery/jquery-2.2.3.min.js"></script>
    <script src=__SOCKETDOMAINURL__/socket.io/socket.io.js"></script>
    <script src="__DOMAINURL____WEBSITEDIR____BAOFENG__/js/layer/layer.js"></script>
    <script src="__DOMAINURL____WEBSITEDIR____BAOFENG__/js/public.js?v=80"></script>
    <link type="text/css" href="__DOMAINURL____WEBSITEDIR____BAOFENG__/js/layer/need/layer.css" rel="stylesheet" />
    <link type="text/css" href="__DOMAINURL____WEBSITEDIR____BAOFENG__/css/user.css" rel="stylesheet" />
    <style>
        #mobilePhone a{
            color:#ffffff;
        }
        .layui-m-layerbtn span[yes]{
            color:#000000;
        }
        .form-control {
            width: 96%;
            padding: 6px 8px;
            font-size: 14px;
            line-height: 1.42857143;
            color: #000000;
            border: 1px solid #d2d6de;
        }
        label {
            display: inline-block;
            max-width: 100%;
            margin-bottom: 5px;
            font-weight: 700;
            float:left;
        }
    </style>
    <style>
        body { padding-bottom: 70px; }
        .center-list-wrap ul {
            padding-left: 10px;
            border-top: 1px solid #bbb;
            border-bottom: 1px solid #bbb;
            background-color: #FFF;
        }
        .center-list-wrap li {
            padding: 13px 20px 13px 0;
            cursor: pointer;
            width: 100%;
            box-sizing: border-box;
            border-top: 1px solid #bbb;
        }
        .center-list-wrap li:first-child {
            border-top: 0;
        }
        .center-list-wrap li > * {
            vertical-align: middle;
            font-size: 14px;
            color: #333;
        }
        .center-list-wrap li .title {
            font-size: 14px;
        }
        .center-list-wrap li .title-tip {
            color: #999;
            font-size: 10px;
            padding: 2px 0;
        }
        .earrow {
            position: relative;
            display: inline-block;
        }
        .earrow:after, .earrow:before {
            position: absolute;
            content: '';
            width: 7px;
            background-color: #ccc;
            height: 2px;
        }
        .earrow-right:before {
            top: 14px;
            transform: rotate(-45deg);
            -ms-transform: rotate(-45deg);
            -moz-transform: rotate(-45deg);
            -webkit-transform: rotate(-45deg);
            -o-transform: rotate(-45deg);
        }
        .earrow-right:after {
            top: 10px;
            transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            -moz-transform: rotate(45deg);
            -webkit-transform: rotate(45deg);
            -o-transform: rotate(45deg);
        }

    </style>
</head>

<body>
<div class="loader">
    <div class="act">
        <div class="spinner">
            <div class="double-bounce1"></div>
            <div class="double-bounce2"></div>
        </div>
    </div>
    <div class="bg"></div>
</div>

<div class="center-list-wrap">
    <ul>
        <li class="table bottom-wrap" id="password-btn-b">
            <div class="content-wrap">
                <div class="title">修改交易密码</div>
                <div class="title-tip">为了您的资金安全，请妥善保管您的交易密码</div>
            </div>
            <div style="float: right;margin-top:-50px;"><span class="earrow earrow-right"></span></div>
        </li>
        <li class="table bottom-wrap" id="bind-mobile-btn-b">
            <div class="content-wrap">
                <div class="title">
                    <span>验证手机</span>
                    <span id="mobile" style="padding-left: 0.5px; color: rgb(29, 132, 212); font-size: 13px;">{$mobile_phone}</span>
                </div>
                <div class="title-tip">若您的验证手机丢失或停用，请立即更换</div>
            </div>
            <div style="float: right;margin-top:-50px;"><span class="earrow earrow-right"></span></div>
        </li>
    </ul>
</div>
<script>
    var timer1 = null;
    $(function () {
        $("#password-btn-b").click(function(){
            var content = '';
            content += '<div class="login_pop">';
            content += '<div class="psw_top1"><input type="password" id="old_password" class="input_number" placeholder="输入当前交易密码"></div>';
            content += '<div class="psw_top1"><input type="password" id="password" placeholder="请输入新交易密码"></div>';
            content += '<div class="psw_top1"><input type="password" id="repeat_password" placeholder="请确认新密码"></div>';
            content += '<div class="not1" style="overflow:hidden;"><span id="fsyzmtip"></span></div>';
            content += '</div>';

            alertMsg({
                title: '修改密码',
                content: content,
                btn: ['修改', '取消'],
                yes: function (index, layero) {
                    var old_password = $("#old_password").val();
                    var password = $("#password").val();
                    var repeat_password = $("#repeat_password").val();
                    if (null == old_password || old_password == "") {
                        $("#fsyzmtip").html("输入当前交易密码");
                        return;
                    }
                    if (null == password || password == "") {
                        $("#fsyzmtip").html("请输入新交易密码");
                        return;
                    }

                    if (password != repeat_password) {
                        $("#fsyzmtip").html("两次输入的密码不一致");
                        return;
                    }

                    loadshow();
                    $.post("../User/changesPass", {old_password:old_password, password:password }, function (result) {
                        loadhide();
                        if (result.code == 1) {
                            m.alertOK(result.msg, function () {});
                        } else {
                            $("#fsyzmtip").html(result.msg);
                        }
                    });
                }
            });

        });

        $("#bind-mobile-btn-b").click(function() {
            var content = '';
            content += '<div class="login_pop">';
            content += '<div class="psw_top1"><input type="tel" id="mobile_phone" class="input_number" placeholder="请输入新的手机号码"></div>';
            content += '<div class="duanxin1 clearfix">';
            content += '<input type="text" id="sms_code" class="code" maxlength="6" placeholder="请输入短信校验码">';
            content += '<a href="javascript:void(0);" id="btnSendCode" time="120" onclick="SendMsg(\'r\')" class="getcode">获取验证码</a>';
            content += '</div>';
            content += '<div class="not1" style="overflow:hidden;"><span id="fsyzmtip"></span></div>';
            content += '</div>';

            alertMsg({
                title: '绑定手机号',
                content: content,
                btn: ['绑定', '取消'],
                yes: function(index) {
                    var mobile_phone = $("#mobile_phone").val();
                    var sms_code = $("#sms_code").val();
                    if (null == mobile_phone || mobile_phone == "") {
                        $("#fsyzmtip").html("请输入新的手机号码");
                        return;
                    }
                    if (null == sms_code || sms_code == "") {
                        $("#fsyzmtip").html("请输入短信校验码");
                        return;
                    }

                    loadshow();
                    $.post("../User/changesMobile", {mobile_phone:mobile_phone, sms_code:sms_code }, function (result) {
                        loadhide();
                        if (result.code == 1) {
                            m.alertOK(result.msg, function () {});
                        } else {
                            $("#fsyzmtip").html(result.msg);
                        }
                    });
                }
            });
        });
    });

    function SendMsg(type) {
        $("#fsyzmtip").html("");
        var phone = $("#mobile_phone").val();
        if (phone.trim() == "") {
            $("#fsyzmtip").html("请输入手机号码！");
            return;
        }
        if ($("#btnSendCode").attr("disabled") != "disabled") {
            $("#btnSendCode").attr('disabled', 'disabled');
            loadshow();
            $.post("../User/sendSMS", {
                type: type,
                mobile_phone: phone
            }, function(result) {
                loadhide();
                if(result.success == 0)
                {
                    $("#fsyzmtip").html("验证码已发送，请注意查收！");
                    timer1 = setInterval(function() {
                        SetRemainTime();
                    },1000);
                }
                else
                {
                    $("#btnSendCode").removeAttr("disabled");
                    $("#fsyzmtip").html(result.msg);
                }
            });
        }
    }

    function SetRemainTime() {
        $("#btnSendCode").attr("disabled", "disabled");
        var time = $("#btnSendCode").attr("time");
        time = time - 1;
        $("#btnSendCode").attr("time", time);
        $("#btnSendCode").html(time + "秒");
        if (time == 0) {
            $("#btnSendCode").removeAttr("disabled");
            $("#btnSendCode").html("发送验证码");
            $("#btnSendCode").attr("time", 120);
            clearInterval(timer1);
        }
    }
</script>
</body>
</html>